<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>SVOM GWAC 警报列表和瞬时可视分析</title>
    <style>
        /* 使整个页面内容居中显示 */
        body {
            font-family: Arial, sans-serif; /* 设定字体 */
            text-align: center;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            height: 100vh;
            padding-top: 50px; /* 顶部间距 */
        }
        h1 {
            margin: 0;
            padding-bottom: 10px; /* 标题下的间距 */
            font-size: 40px; /* 增大标题字体大小 */
        }
        #timeDisplayUTC {
            font-size: 16px; /* 时间显示的字体大小 */
            color: #666; /* 时间文字颜色 */
            margin-bottom: 20px; /* 时间显示与表格间的间距 */
        }
        #heartbeatTimeDisplay {
            font-size: 16px; /* 时间显示的字体大小 */
            color: #666; /* 时间文字颜色 */
            margin-bottom: 20px; /* 时间显示与表格间的间距 */
        }

        table {
            border: 1px solid black;
            border-collapse: collapse;
            /* 表格字体大小调整为更大 */
            font-size: 16px;
        }
        th, td {
            border: 1px solid black;
            padding: 10px; /* 增加填充使表格更易读 */
        }
        table tr{
            text-wrap: nowrap;
        }
    </style>
</head>
<body>
    <h1>SVOM GWAC 警报列表和瞬时可视分析</h1>
    <div id="timeDisplayUTC"></div> <!-- 时间显示元素 -->
    <div id="heartbeatTimeDisplay"></div> <!-- 新增加的心跳信息时间显示 -->
    <div id="summary"></div>
    <table id="dataTable">
        <thead>
            <tr>
                <th>警报序号</th>
                <th>可视编号</th>
                <th>警报名</th>
                <th>RA deg</th>
                <th>DEC deg</th>
                <th>误差 角秒</th>
                <th>日期 UT</th>
                <th>时间 UT</th>
                <th>恒星时</th>
                <th>时角 deg</th>
                <th>目标高度角 deg</th>
                <th>太阳高度角 deg</th>
            </tr>
        </thead>
        <tbody>
            <!-- 表格数据将在这里插入 -->
        </tbody>
    </table>
    <script>
     window.onload = function() {
        let lastModified;
        let lastHeartbeatUpdate = new Date(); // 存储最后一次心跳文件更新的时间

        function fetchAndDisplayData() {
            fetch('alertdata/event_gwac_observation_results_all.txt')
                .then(response => {
                    const newLastModified = response.headers.get('Last-Modified');
                    if (lastModified && newLastModified !== lastModified) {
                        window.location.reload(); // 如果文件被修改，重新加载页面
                    }
                    lastModified = newLastModified; // 更新最后修改时间
                    return response.text();
                })
                .then(text => {
                    const lines = text.trim().split('\n');
                    const tableBody = document.getElementById('dataTable').getElementsByTagName('tbody')[0];
                    tableBody.innerHTML = '';

                    let flag0Count = 0;
                    let flag1Count = 0;

                    lines.reverse().forEach((line, index) => {
                        const row = tableBody.insertRow();
                        const indexCell = row.insertCell();
                        indexCell.textContent = lines.length - index;
                        const cells = line.trim().split(/\s+/);
                        cells.forEach((cell, cellIndex) => {
                            const cellElement = row.insertCell();
                            cellElement.textContent = cell;
                            if (cellIndex === 0) {
                                if (cell === '0') {
                                    flag0Count++;
                                }
                                if (cell === '1') {
                                    flag1Count++;
                                    cellElement.style.color = 'red'; // 设置字体颜色为红色
                                    cellElement.style.fontSize = 'larger'; // 增大字号
                                }
                            }
                        });
                    });

                    document.getElementById('summary').innerHTML = `总条目: ${lines.length}, Flag=1 的条目数: <span style="color: red; font-size: 26px">${flag1Count}</span>, Flag=0 的条目数: ${flag0Count}`;
                })
                .catch(error => {
                    console.error('加载数据时出错:', error);
                });
        }

        fetchAndDisplayData();
        setInterval(fetchAndDisplayData, 3000); // 每30秒检查一次文件变化

        function updateTimeUTC() {
            const now = new Date();
            const year = now.getUTCFullYear();
            const month = now.getUTCMonth() + 1;
            const day = now.getUTCDate();
            const hours = now.getUTCHours();
            const minutes = now.getUTCMinutes();
            const seconds = now.getUTCSeconds();
            const utcString = `${year}-${month.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')} ${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')} UTC`;
            document.getElementById('timeDisplayUTC').textContent = utcString;
    }

    setInterval(updateTimeUTC, 1000);
    updateTimeUTC();

    function updateHeartbeatTime() {
        fetch('alertdata/gwac_alive.txt')
            .then(response => {
                const heartbeatLastModified = response.headers.get('Last-Modified');
                if (heartbeatLastModified) {
                    const heartbeatTime = new Date(heartbeatLastModified);
                    lastHeartbeatUpdate = heartbeatTime; // 更新最后一次心跳时间
                    const displayString = `最近收到的GWAC警报数据处理系统发来的心跳信息时间为 ${heartbeatTime.toLocaleString('zh-CN', {hour12: false})}`;
                    document.getElementById('heartbeatTimeDisplay').textContent = displayString;
                }
                })
                .catch(error => {
                    console.error('加载心跳文件时出错:', error);
                });
        }

        setInterval(updateHeartbeatTime, 1000);
        updateHeartbeatTime();

        function checkHeartbeat() {
            const now = new Date();
            const diff = now - lastHeartbeatUpdate;
            if (diff > 3600000) { // 1小时毫秒数
                alert('超过1小时未检测到心跳文件更新！检查GRB服务器（.166上xgrb.sh）程序是否正常运行');
            }
        }

        setInterval(checkHeartbeat, 60000); // 每分钟检查一次心跳时间是否超时
    };
    </script>


</body>
</html>
